<template>
    <h-collapse>
        <template #title>
            <flexbox class="title">
                <span class="title">版本能效</span>
            </flexbox>
        </template>
        <div class="card">
            <div class="card-cont">
                <energy-table :detail="detail" />
            </div>
        </div>
    </h-collapse>
</template>

<script lang="ts">
import HCollapse from './HCollapse.vue';
import EnergyTable from './EnergyTable.vue';
import { HLineChart } from '@/components';
import { defineComponent, ref, unref, reactive, toRefs, watch } from 'vue';
export default defineComponent({
    name: 'insideChartsPmpChart',
    props: {
        detail: {
            type: Object,
            default: () => ({})
        }
    },
    components: {
        HLineChart,
        EnergyTable,
        HCollapse
    },
    emits: ['handleShowTipModal'],
    setup(props, { emit }) {
        const handleShowTipModal = () => {
            emit('handleShowTipModal', 2);
        };
        return {
            handleShowTipModal
        };
    }
});
</script>

<style scoped lang="less">
.card {
    min-height: 372px;
    overflow: hidden;
    position: relative;
    background-color: #fff;
    border-radius: 4px;
    cursor: pointer;
    &-cont {
        padding: 0 24px;
    }
}
.card:first-child {
    margin-left: 0 !important;
    margin-top: 0 !important;
}
</style>